<template>
  <div class="content_body">
    <Affix :offset-top="70">
      <Menu
        mode="horizontal"
        :active-name="this.highlight"
        class="user_menu"
        @on-select="navigateTo"
      >
        <MenuItem name="posts">专栏</MenuItem>
        <MenuItem name="collections">收藏集</MenuItem>
        <MenuItem name="follows">关注</MenuItem>
      </Menu>
    </Affix>
    <!-- 导航栏 -->

    <div class="route_wapper">
      <router-view />
    </div>
  </div>
</template>

<script>
export default {
  name: "UserContent",
  data() {
    return {
      peopleId: "",
      highlight: this.$route.meta.root,
      uid: this.$route.params.uid
    };
  },

  watch: {
    $route(val) {
       this.highlight = val.meta.root;
      this.uid = val.params.uid;
    }
  },
  methods: {
    navigateTo(name) {
      this.$router.push("/user/" + this.uid + "/" + name);
    }
  }
};
</script>

<style lang='scss'>
.content_body {
  .user_menu {
    height: 3rem;
    line-height: 3rem;
  }
  .ivu-affix {
    z-index: 1000;
  }
}
</style>